.playList_box{
    display: flex;
    flex-direction: column;
    position: fixed;
    right: 0;
    top: var(--musicHeight);
    bottom: var(--musicHeight);
    width: 280px;
    background-color: var(--bg-primary);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
    .playList_box_header{
        display: flex;
        align-items: center;
        height: 40px;
        gap: 8px;
        .playList_box_header_hide{
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            height: 100%;
            padding: 0 16px;
            svg{
                width: 18px;
                height: 18px;
            }
            &:hover{
                background-color: var(--bg-tertiary);
            }
        }
        .playList_box_header_title{
            flex: 1;
            height: 100%;
            display: flex;
            align-items: center;
            span{
                display: flex;
                align-items: center;
                justify-content: center;
                width: 24px;
                height: 24px;
                cursor: pointer;
                &:hover{
                    color: var(--danger);
                }
            }
        }
    }
    .playList_box_content{
        flex: 1;
        height: 0;
        overflow: auto;
        padding: 8px 0;
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        gap: 8px;
        .playList_box_item{
            display: flex;
            align-items: center;
            width: 100%;
            justify-content: space-between;
            box-sizing: border-box;
            padding: 4px 16px;
            gap: 6px;
            cursor: pointer;
            color: var(--text-secondary);
            .playList_box_item_left{
                flex: 1;
                width: 0;
                display: flex;
                gap: 6px;
                .playList_box_item_index{
                    display: flex;
                    align-content: center;
                    justify-content: center;
                    flex-wrap: wrap;
                    width: 28px;
                }
                .playList_box_item_info{
                    flex: 1;
                    overflow: hidden;
                    .playList_box_item_info_title{
                        font-weight: 600;
                        font-size: 14px;
                        white-space: nowrap;
                        overflow: hidden;
                        text-overflow: ellipsis;
                    }
                    .playList_box_item_info_artist{
                        font-size: 12px;
                        color: var(--text-secondary);
                        white-space: nowrap;
                        overflow: hidden;
                        text-overflow: ellipsis;
                    }
                }
            }
            .playList_item_delete{
                display: none;
                -webkit-user-select: none;
                user-select: none;
                height: 100%;
                align-items: center;
                justify-content: center;
                margin-right: 12px;
                &:hover{
                    color: #FF4D4D80;
                }
            }
            &:hover{
                background-color: var(--bg-secondary);
                padding-right: 0;
            }
            &:hover .playList_item_delete{
                display: flex;
            }
        }
        .playing{
            background-color: var(--bg-secondary);
        }
    }
}